<!DOCTYPE html>
<html>
<head>

<title>@[html.title]</title>
<meta charset="UTF-8">
<meta name="author" content="ok">
<meta name="copyright" content="eMag 2010">
<meta name="description" content="Welcome to iphone emag @[prod.vers]">
<!--iphone.meta-->
<link rel="apple-touch-icon" href="apple-touch-icon.png"/>  
<link rel="apple-touch-startup-image" href="apple-touch-startup.png" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="viewport"
	content="width=device-width; initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />

<!--@html.css@-->
<style type="text/css" media="screen">
@import "css/theme.css";
</style>
<style type="text/css" media="screen">
@import "css/effects.css";
</style>
<style type="text/css" media="screen">
@import "css/cpanel.css";
</style>
<style type="text/css" media="screen">
@import "css/main.css";
</style>
<!--@@-->
<!--@html.js@-->
<script type="text/javascript" src="js/utils.js"></script>
<script type="text/javascript" src="js/labels.js"></script>
<script type="text/javascript" src="js/screenPager.js"></script>
<script type="text/javascript" src="js/main.js"></script>

    <script type="text/javascript" charset="utf-8" src="phonegap.0.9.4.min.js"></script>
   
<!--@@-->

</head>
<body class="landscape">
<noscript> 
<h1 class="jsDisabled">Please enable javascript support</h1>
</noscript> 

<div id="splashScreen">
	<div><div>LOADING...</div></div>
</div>

<div id="content">
<!--1. READER -->
<div id="scrReader" class="jPage jCurrent">
<!--1.1 Pager -->
<div id="readerPager">
<div id="cntPages"></div>
<div id="curPages">
	<div class="tapme"><span></span><div></div></div>
	<div class="tapme"><span></span><div></div></div>
</div>

<!--1.2 TextView -->
<div id="readerText"><pre></pre></div>
</div>

<!--1.3 Zoom -->
<div id="pageZoom">
<div id="cntPageZoom"><div class="bkgImage"></div></div>
<div id="pageZoomControl">
<ul>
	<li id="cpZoomIn" class="tapme"><span></span></li>
	<li id="cpZoomOut" class="tapme"><span></span></li>
	<li id="cpZoomClose" class="tapme"><span></span></li>
</ul>
</div>

</div>



<!--1.4 Control Panel -->
<div id="controlPanel">
<ul>
	<li id="cpText" class="tapme toggle"><span>Text</span></li>
	<li id="cpIndex" class="tapme"><span>Index</span></li>
	<li id="cpSearch" class="tapme"><span>Search</span></li>
	<li id="cpShare" class="tapme"><span>Share</span></li>
	<li id="cpPgGoTo" class="tapme"><span>GoTo</span></li>
	<li id="cpMore" class="tapme"><span></span></li>
	<li id="cpLess" class="tapme"><span></span></li>
	<li id="cpPgPrev" class="tapme"><span>Prev</span></li>
	<li id="cpPgNext" class="tapme"><span>Next</span></li>
	<li id="cpPgZoom" class="tapme"><span>Zoom</span></li>
</ul>
</div>

</div>
<!--2. BOOK INDEX -->
<div id='scrIndex' class="jPage">
<div class='toolbar'>
<h1>Index</h1>
<a class="button cancel" href="#">Cancel</a> 
<a id="enterPageNum" class="button" href="#">Page#</a></div>
<div id="bookIndex">
</div>
</div>
<!--3. SEARCH -->
<form id='scrSearch' class="jPage">
<div class='toolbar'>
<h1>Search</h1>
<a class="button cancel" href="#">Cancel</a>
</div>
<h2>Nothing found</h2>
<ul class="jUL">
<li><input type="text" id="search" name="search" placeholder="Search term" /></li>
</ul>
<a class="whiteButton search">Search</a> <a class="grayButton clear">Clear</a>
</form>
<!--3.1 SEARCH RESULTS -->
<div id="scrSearchResults" class="jPage">
<div class="toolbar">
<h1>Search results!</h1>
<a class="button cancel" href="#">Cancel</a></div>
<div id="searchResults">
<ul class="jUL">
</ul>
</div>
</div>
<!--4. SHARE -->
<form id="scrShare" class="jPage">
<div class="toolbar">
<h1>Share This!</h1>
<a class="button cancel" href="#">Cancel</a> 
<a id="mailto" class="button" href="#">Email</a></div>
<div id="socBookmarks" style="scrollForm">
<ul class="jUL">
	<li><span id="bmTwitter">Twitter</span></li>
	<li><span id="bmFacebook">Facebook</span></li>
	<li><span id="bmDigg">Digg</span></li>
	<li><span id="bmDelicious">del.icio.us</span></li>
	<li><span id="bmStumbleupon">Stumble Upon</span></li>
	<li><span id="bmMyspace">MySpace</span></li>
</ul>
</div>
</form>
</div>

</body>
</html>
